<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ page import="com.lp.cfg.ProConfig"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<!DOCTYPE html>
<html>
<head>
	<title><%=ProConfig.PROJECT_NAME %></title>
	<%@ include file="/WEB-INF/wechat/iot/common/resource_lib.jsp"%>
	<style type="text/css">
		.body-container{
			background: #fff ;
			padding-top: 20px;
		}
		.weui-cells{
			margin-top: 0;
			font-size: 15px;
		}
	</style>
</head>
<body>
	<div class="container">
		<div class="t-c title-info">
			<span>信息修改</span>
			<div class="back" onclick="forward('/wiot/user')" style=" position: fixed;top: 0px;" >返回</div>
		</div>
		<div style="height: 50px;"></div>
		
		<div class="body-container hide jui-auto" data-options= "method:'GET',url:'/user/info?id=${user.id}',before:'before' " >
			<div class="weui-cells weui-cells_form">
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label class="weui-label">用户名：</label>
					</div>
					<div class="weui-cell__bd">
						<span class="discolor">{name}</span>
					</div>
				</div>
				
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label class="weui-label">头像：</label>
					</div>
					<div class="weui-cell__bd">
						<img id="userphoto" tag=""  src="{wx_img_url}" style="height:78px; border-radius: 3px;"> 
						<div class="weui-uploader__input-box" style="margin-bottom: 0;">
           					 <input id="uploaderInput" onchange="btnUploadFile(event)" class="weui-uploader__input" type="file" accept="image/*" multiple="">
						</div>
					</div>
				</div>
				
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label class="weui-label">用户类型：</label>
					</div>
					<div class="weui-cell__bd discolor">
						{data.type}
					</div>
				</div>
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label class="weui-label">邮箱：</label>
					</div>
					<div class="weui-cell__bd">
						<input class="weui-input email" value="{email}" placeholder="请输入备注，可为空">
					</div>
				</div>

				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label class="weui-label">手机号</label>
					</div>
					<div class="weui-cell__bd">
						<input class="weui-input phone" value="{phone}"  type="text" placeholder="请输入11位手机号码" >
					</div>
				</div>
				
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label class="weui-label">昵称</label>
					</div>
					<div class="weui-cell__bd">
						<input class="weui-input nick_name" value="{nick_name}"  type="text" placeholder="请输入昵称" >
					</div>
				</div>
				
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label class="weui-label">注册时间：</label>
					</div>
					<div class="weui-cell__bd discolor">
						{atimes}
					</div>
				</div>

			</div>
			<div class="width80 m-auto" style="padding: 30px 0;">
				<a class="weui-btn" style="background: #3499da;" onclick="saveBtn()"  id="saveBtn">保存</a>			
			</div>
		</div>
	</div>
</body>
<script type="text/javascript">
	
	function btnUploadFile(e,type){
	    //获取图片
	    var files = e.target.files;
	    var file = files[0];
	    if (!/\/(?:jpeg|jpg|png)/i.test(file.type)){
	        return;
	    }
	    var reader = new FileReader();
	    reader.onload = function() { 
	        var result = this.result;  //图片base64字符串
	        if(result.length > 6 * 1024 * 1024){
	        	tip('图片过大，请重新选择',e);
	        	return ;
	        }
	        if( result.length <= 300 * 1024 ){
	        	// 上传图片
                postAjax( localUrl + "/base64/fileInfo.json", {base64File: result },function(data){
                	if(isOK(data)){
                		 $("#userphoto").attr("src",result);  	//预览图片
                		 $("#userphoto").attr("tag", imgUrl+data.data.file_path +"/"+data.data.id+"."+data.data.fix );
        	        	 $("#userphoto").show();
                	}
                });
	        	 
	        }else{
	        	var img = new Image();
	        	img.src = result;
	        	img.onload = function() {
	                var compressedDataUrl = compress(img, file.type);
	                // 上传图片
	                postAjax( localUrl + "/base64/fileInfo.json", {base64File: compressedDataUrl },function(data){
	                	if(isOK(data)){
	                		$("#userphoto").attr("src",compressedDataUrl);  	//预览图片
	                		 $("#userphoto").attr("tag", imgUrl+data.data.file_path +"/"+data.data.id+"."+data.data.fix );
	     	                $("#userphoto").show();
	                	}
	                });
	            };
	        }
	    };
	    reader.readAsDataURL(file);    //Base64
	}
	
	function saveBtn(){
		// 更新用户信息
		if(validater.empty( $(".email").val())){
			tip("邮箱不能为空",'w');
			return ;
		}
		if(validater.empty( $(".phone").val())){
			tip("手机号不能为空",'w'); 
			return ;
		}else{
			if( $(".phone").val().length > 11  ){
				tip("手机号不能超过11位",'w'); 
				return ;
			}
		}
		
		var data = {
			'id':'${user.id}',
			'email':$(".email").val(),
			'phone':$(".phone").val(),
			'nick_name': $(".nick_name").val()
		}
		if(! validater.empty($("#userphoto").attr("tag")) ){
			data.wx_img_url = $("#userphoto").attr("tag") ;
		}
		commonAjax('PUT',localUrl+"/user/info.json", data,function(data){
			if(isOK(data)){
				tip("保存成功");
				setTimeout(function() {
					forward('/wiot/user') ;
				}, 300);
			}
		});
		
	}
	
	$(function(){
		
		
	})
	
	function before(data){
		data.data.atimes = time2Str(data.data.atime);
		if( validater.empty( data.data.wx_img_url )){
			$("#userphoto").hide();
		}
		return data ;
	}
</script>
</html>